:root {
  --w--focus-color: #2498ff;
  --w-grid-cell-border-color: #ddd;
  --w-grid-cell-label-background-color: #f9f9f9;
  --w-table-border-color: #ddd;
  --w-td-border-color: #ddd;
  --w-thead-background-color: #eee;
}

html,
input,
select,
textarea,
button {
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  outline: none;
}

html,
body,
#app,
#app>.w-view {
  margin: 0;
  height: 100%;
  overflow: hidden;
}

button {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

[w-width="*"] {
  width: 100%;
}

[w-height="*"] {
  height: 100%;
}

.f-link {
  cursor: pointer;
}

.f-link:hover {
  color: var(--w--focus-color);
}

.f-dialog-local-wrap,
.f-rel {
  position: relative;
}

.f-abs-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.f-abs-full {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.f-none {
  display: none;
}

.f-form-hide {
  visibility: hidden;
}

.f-width {
  width: 100%;
}

.f-height {
  height: 100%;
}

.f-flex {
  display: flex;
}

.f-flex-1 {
  flex: 1;
}

.f-flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.f-flex-align {
  display: flex;
  align-items: center;
}

.f-flex-column {
  display: flex;
  flex-direction: column;
}

.f-layout-grow {
  flex: 1;
  flex-shrink: 1;
  overflow: hidden;
}

.f-oh {
  overflow: hidden;
}

.f-br {
  white-space: normal;
  word-break: break-all;
  word-wrap: break-word;
}

.f-keyword {
  color: red;
  font-style: normal
}

.f-line-1 {
  overflow: hidden;
  word-break: keep-all;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.f-line-2,
.f-line-3 {
  display: -webkit-box;
  white-space: normal;
  word-break: break-all;
  word-wrap: break-word;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.f-line-3 {
  -webkit-line-clamp: 3;
}

.f-pointer {
  cursor: pointer;
}

.f-hide {
  display: none;
}

.f-dfish-dialog {
  background-color: #fff;
}

.f-dfish-dialog.z-snap {
  border: 1px solid var(--w--focus-color);
  box-shadow: none;
}

.f-dfish-dialog-head {
  background-color: #2398ff;
  color: #fff;
}

.f-dfish-dialog-title {
  display: flex;
  align-items: center;
  padding-left: 10px;
}

.f-dfish-dialog-close {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.f-dfish-dialog-close:hover {
  background-color: #D00;
}

.f-dfish-dialog-foot {
  background-color: #f8f8f8;
}

.z-v-align-left:not(.w-scroll) {
  align-items: flex-start;
}

.z-v-align-center:not(.w-scroll) {
  align-items: center;
}

.z-v-align-right:not(.w-scroll) {
  align-items: flex-end;
}

.z-v-valign-top:not(.w-scroll) {
  justify-content: flex-start;
}

.z-v-valign-middle:not(.w-scroll) {
  justify-content: center;
}

.z-v-valign-bottom:not(.w-scroll) {
  justify-content: flex-end;
}

.z-v-valign-between:not(.w-scroll) {
  justify-content: space-between;
}

.z-v-valign-around:not(.w-scroll) {
  justify-content: space-around;
}

.z-h-align-left:not(.w-scroll) {
  justify-content: flex-start;
}

.z-h-align-right:not(.w-scroll) {
  justify-content: flex-end;
}

.z-h-align-center:not(.w-scroll) {
  justify-content: center;
}

.z-h-align-between:not(.w-scroll) {
  justify-content: space-between;
}

.z-h-align-around:not(.w-scroll) {
  justify-content: space-around;
}

.z-h-valign-top:not(.w-scroll) {
  align-items: flex-start;
}

.z-h-valign-bottom:not(.w-scroll) {
  align-items: flex-end;
}

.z-h-valign-middle:not(.w-scroll) {
  align-items: center;
}

.z-h-valign-auto:not(.w-scroll) {
  align-items: auto;
}

.w-vertical.z-br:not(.w-scroll),
.w-vertical.z-br>.w-scroll-overflow>.w-scroll-cont,
.w-horizontal.z-br:not(.w-scroll),
.w-horizontal.z-br>.w-scroll-overflow>.w-scroll-cont {
  flex-wrap: wrap;
}

.w-horizontal:not(.w-scroll),
.w-horizontal>.w-scroll-overflow>.w-scroll-cont {
  display: flex;
  box-sizing: border-box;
}

.w-horizontal>.w-scroll-overflow {
  width: 100%;
}

.w-horizontal>.w-scroll-overflow>.w-scroll-cont {
  min-width: 100%;
  height: 100%;
}

.w-horizontal:not(.w-scroll)>*,
.w-horizontal>.w-scroll-overflow>.w-scroll-cont>* {
  flex-shrink: 0;
}

.f-h-gap:not(.w-scroll)>*,
.f-h-gap>.w-scroll-overflow>.w-scroll-cont>* {
  margin-right: var(--w-compat-gap);
}

.f-h-gap:not(.w-scroll)>*:last-child,
.f-h-gap>.w-scroll-overflow>.w-scroll-cont>*:last-child {
  margin-right: 0;
}

.f-v-gap:not(.w-scroll)>*,
.f-v-gap>.w-scroll-overflow>.w-scroll-cont>* {
  margin-bottom: var(--w-compat-gap);
}

.f-v-gap:not(.w-scroll)>*:last-child,
.f-v-gap>.w-scroll-overflow>.w-scroll-cont>*:last-child {
  margin-bottom: 0;
}

.w-horizontal:not(.w-scroll)>[w-width="*"]:not(.w-dialog),
.w-horizontal>.w-scroll-overflow>.w-scroll-cont>[w-width="*"] {
  flex: 1;
  flex-shrink: 1;
  overflow: hidden;
}

.z-h-align-left>.w-scroll-overflow>.w-scroll-cont {
  justify-content: flex-start;
}

.z-h-align-right>.w-scroll-overflow>.w-scroll-cont {
  justify-content: flex-end;
}

.z-h-align-center>.w-scroll-overflow>.w-scroll-cont {
  justify-content: center;
}

.z-h-valign-left>.w-scroll-overflow>.w-scroll-cont {
  align-items: flex-start;
}

.z-h-valign-bottom>.w-scroll-overflow>.w-scroll-cont {
  align-items: flex-end;
}

.z-h-valign-middle>.w-scroll-overflow>.w-scroll-cont {
  align-items: center;
}

.w-vertical:not(.w-scroll),
.w-vertical>.w-scroll-overflow>.w-scroll-cont {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.w-vertical:not(.w-scroll)>*,
.w-vertical>.w-scroll-overflow>.w-scroll-cont>* {
  flex-shrink: 0;
}

.w-vertical:not(.w-scroll)>[w-height="*"]:not(.w-dialog),
.w-vertical>.w-scroll-overflow>.w-scroll-cont>[w-height="*"] {
  flex: 1;
  flex-shrink: 1;
  overflow: hidden;
}

.z-v-align-left>.w-scroll-overflow>.w-scroll-cont {
  align-items: flex-start;
}

.z-v-align-right>.w-scroll-overflow>.w-scroll-cont {
  align-items: flex-end;
}

.z-v-align-center>.w-scroll-overflow>.w-scroll-cont {
  align-items: center;
}

.z-v-valign-left>.w-scroll-overflow>.w-scroll-cont {
  justify-content: flex-start;
}

.z-v-valign-bottom>.w-scroll-overflow>.w-scroll-cont {
  justify-content: flex-end;
}

.z-v-valign-middle>.w-scroll-overflow>.w-scroll-cont {
  justify-content: center;
}

.w-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  cursor: pointer;
  border: 1px solid #ccc;
  margin: 0;
  height: 32px;
  background: #fff;
  border-radius: 0;
}

.w-button-main {
  position: relative;
  display: flex;
  flex: 1;
  padding: 0 20px;
  justify-content: center;
}

.w-button-main>* {
  margin-right: 10px;
}

.w-button-main>*:last-child {
  margin-right: 0;
}

.w-button .f-i {
  color: #999;
}

.w-button-text {
  display: flex;
  align-items: center;
}

.w-button-main .w-button-more {
  width: 10px;
  overflow: hidden;
  margin-left: -2px;
  margin-right: -7px;
}

.w-button-loading {
  margin: 0;
}

.w-button-drop {
  width: 22px;
  border-left: 1px solid #ddd;
}

.w-button>.w-button-close {
  margin-right: -5px;
  flex-shrink: 0;
  color: #aaa;
}

.w-button-close-icon:hover {
  color: #f00;
}

.w-button.z-drop.z-more,
.w-button.z-drop.z-combo .w-button-drop,
.w-button.z-hv,
.w-button-main.z-hv,
.w-button-drop.z-hv {
  background: #f8f8f8;
}

.w-button.z-ds,
.w-button.z-loading {
  background-color: #eee;
  cursor: default;
}

.w-button.z-loading .w-button-text {
  opacity: .2;
}

.w-button.z-loading .f-svg {
  width: 2em;
  height: 2em;
  fill: currentcolor;
}

.w-button.z-loading .f-svg use {
  stroke: currentcolor;
}

.w-button.z-ds .w-button-icon {
  color: #bbb;
}

.w-button.z-vertical .w-button-main {
  flex-direction: column;
}

.w-button.z-closable .w-button-main {
  padding-right: 10px;
}

.w-button.z-face-primary {
  border-color: var(--w--focus-color);
  background-color: var(--w--focus-color);
  color: #fff;
}

.w-button.z-face-primary .f-i {
  color: #fff;
}

.w-button.z-face-primary.z-drop.z-more,
.w-button.z-face-primary.z-drop.z-combo .w-button-drop,
.w-button.z-face-primary.z-hv,
.w-button.z-face-primary .w-button-main.z-hv,
.w-button.z-face-primary .w-button-drop.z-hv,
.w-button.z-face-primary.z-loading {
  background: #208ff2;
}


.w-alert,
.w-confirm {
  min-width: 230px;
  max-width: 720px;
  background: #fff;
  border: 1px solid #bbb;
}

.w-alert-icon {
  min-width: 40px;
}

.w-alert-icon .f-i {
  font-size: 30px;
  margin-top: 2px;
}

.w-alert-icon .f-i-warning {
  color: var(--w--focus-color)
}

.w-alert-icon .f-i-question {
  color: rgb(37, 195, 3)
}

.w-alert-icon .f-i-check-circle {
  color: rgb(37, 195, 3)
}

.w-alert-move {
  padding-left: 15px;
  text-align: left;
}

.w-alert-title {
  padding-top: 0;
  height: 40px;
  line-height: 40px;
}

.w-alert-body {
  padding-bottom: 20px;
}

.w-alert-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 100%;
  padding: 0 15px;
  white-space: normal;
  word-break: break-all;
  word-wrap: break-word;
}

.w-alert-buttonbar {
  background-color: #fff;
  justify-content: center;
  height: 50px;
  --w-compat-gap: 10px;
  gap: var(--w-compat-gap);
}

.w-alert-main {
  padding: 20px 40px;
}

.w-alert-head {
  height: 40px;
  background-color: var(--w--focus-color);
  color: #fff;
}

.w-alert-close {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
}

.w-alert-close:hover {
  background: #d00;
}

/** 辅助功能  **/
.w-dialog.f-dialog-preview {
  background: #333
}

.f-dialog-preview.z-video {
  background: #000
}

.f-dialog-preview ._dlg_x {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  background: url(g/i.png) no-repeat 0 -187px;
  cursor: pointer;
  z-index: 1
}

.f-dialog-preview ._dlg_x:hover {
  background-position: 0 -228px
}

.f-dialog-preview ._origin {
  text-decoration: none;
}

.f-dialog-preview ._rotate {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  height: 40px;
  line-height: 40px;
  text-align: center;
}

.f-dialog-preview ._rotate a {
  color: #eee;
  cursor: pointer
}

.f-dialog-preview ._rotate ._s {
  margin: 0 10px;
  color: #999
}

.f-dialog-preview ._rotate .f-i {
  font-size: 12px;
  color: #ddd
}

.f-dialog-preview ._img {
  margin: auto;
  background: #fff;
  position: absolute;
  left: 0;
  right: 0;
  top: 0px;
  bottom: 0;
  max-width: calc(100% - 80px);
  max-height: calc(100% - 80px);
}

.f-dialog-preview .w-swiper-arrow.z-left,
.f-dialog-preview .w-swiper-arrow.z-right {
  width: 80px;
}

.f-dialog-preview .w-swiper-indicator-dot.z-on {
  background: #ff7921;
}

.f-arw {
  display: inline-block;
  border: 4px solid transparent;
  vertical-align: middle;
}

.f-arw-b4,
.f-arw-t4 {
  border-width: 8px 7px
}

.f-arw-r4,
.f-arw-l4 {
  border-width: 7px 8px
}

.f-arw-b5,
.f-arw-t5 {
  border-width: 9px 8px
}

.f-arw-r5,
.f-arw-l5 {
  border-width: 8px 9px
}

.f-arw-b4,
.f-arw-b5 {
  border-bottom: 0;
  border-top-color: #666;
}

.f-arw-r4,
.f-arw-r5 {
  border-right: 0;
  border-left-color: #666;
  margin: 0 2px
}

.f-arw-t4,
.f-arw-t5 {
  border-top: 0;
  border-bottom-color: #666;
}

.f-arw-l4,
.f-arw-l5 {
  border-left: 0;
  border-right-color: #666;
  margin: 0 2px
}


@font-face {
  font-family: 'dfish-icon';
  src: url('f/iconfont.woff2') format('woff2'),
    url('f/iconfont.woff') format('woff'),
    url('f/iconfont.ttf') format('truetype');
}

.f-i {
  font-family: "dfish-icon" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.f-i-caret-down,
.f-i-caret-up,
.f-i-caret-left,
.f-i-caret-right {
  font-size: 18px
}

.f-i-git:before {
  content: '\e67b'
}

.f-i-mail:before {
  content: '\e67c'
}

.f-i-qq:before {
  font-size: 24px;
  content: '\e67d'
}

.f-i-gitee:before {
  content: '\e67e'
}

.f-i-rotate-left:before {
  content: '\e676'
}

.f-i-rotate-right:before {
  content: '\e677'
}

.f-i-folder:before {
  content: '\e673'
}

.f-i-folder-open:before {
  content: '\e675'
}

.f-i-file:before {
  content: '\e674'
}

.f-i-folder-full:before {
  content: '\e685'
}

.f-i-folder-open-full:before {
  content: '\e684'
}

.f-i-file-full:before {
  content: '\e683'
}

.f-i-layout-list:before {
  content: '\e671'
}

.f-i-layout-grid:before {
  content: '\e672'
}

.f-i-comment:before {
  content: '\e668'
}

.f-i-comment-full:before {
  content: '\e663'
}

.f-i-thumbs-up:before {
  content: '\e662'
}

.f-i-thumbs-up-full:before {
  content: '\e664'
}

.f-i-read:before {
  content: '\e667'
}

.f-i-read-full:before {
  content: '\e666'
}

.f-i-top:before {
  content: '\e65f'
}

.f-i-search-square:before {
  content: '\e660'
}

.f-i-post-create:before {
  content: '\e661'
}

.f-i-user:before {
  content: '\e65e'
}

.f-i-edit:before {
  content: '\e65c'
}

.f-i-view:before {
  content: '\e65a'
}

.f-i-favor:before {
  content: '\e65b'
}

.f-i-trash:before {
  content: '\e65d'
}

.f-i-angle-double-left:before {
  content: '\e697'
}

.f-i-angle-double-right:before {
  content: '\e694'
}

.f-i-angle-double-down:before {
  content: '\e695'
}

.f-i-angle-double-up:before {
  content: '\e696'
}

.f-i-check:before {
  content: '\e647'
}

.f-i-caret-down:before {
  content: '\e654'
}

.f-i-caret-left:before {
  content: '\e655'
}

.f-i-caret-right:before {
  content: '\e657'
}

.f-i-caret-up:before {
  content: '\e658'
}

.f-i-leaf-folder:before {
  content: '\e651'
}

.f-i-leaf-folder-open:before {
  content: '\e652'
}

.f-i-leaf-file:before {
  content: '\e653'
}

.f-i-ellipsis:before {
  content: '\e650'
}

.f-i-upload-image:before {
  content: '\e64d'
}

.f-i-upload:before {
  content: '\e64e'
}

.f-i-date:before {
  content: '\e64f'
}

.f-i-long-arrow-down:before {
  content: '\e68b'
}

.f-i-long-arrow-right:before {
  content: '\e68c'
}

.f-i-long-arrow-left:before {
  content: '\e68d'
}

.f-i-long-arrow-up:before {
  content: '\e68a'
}

.f-i-long-arrow-top:before {
  content: '\e689'
}

.f-i-long-arrow-bottom:before {
  content: '\e688'
}

.f-i-minus:before {
  content: '\e687'
}

.f-i-plus:before {
  content: '\e686'
}

.f-i-plus-square:before {
  content: '\e645'
}

.f-i-minus-square:before {
  content: '\e646'
}

.f-i-warning:before {
  content: '\e642'
}

.f-i-question:before {
  content: '\e644'
}

.f-i-check-circle:before {
  content: '\e643'
}

.f-i-search:before {
  content: '\e641'
}

.f-i-angle-first:before {
  content: '\e692'
}

.f-i-angle-last:before {
  content: '\e693'
}

.f-i-angle-up:before {
  content: '\e691'
}

.f-i-angle-down:before {
  content: '\e68f'
}

.f-i-angle-left:before {
  content: '\e68e'
}

.f-i-angle-right:before {
  content: '\e690'
}

.f-i-star-empty:before {
  content: '\e638'
}

.f-i-star-full:before {
  content: '\e639'
}

.f-i-star-half:before {
  content: '\e63a'
}

.f-i-dialog-max:before {
  content: '\e637'
}

.f-i-dialog-min:before {
  content: '\e635'
}

.f-i-dialog-restore:before,
.w-dialog.z-max .f-i-dialog-max:before {
  content: '\e634'
}

.f-i-close:before {
  content: '\e636'
}

.f-i-play:before {
  content: '\e618'
}

.f-i-file-vid {
  background: url(g/f.png) -97px -87px
}

.f-i-file-ppt {
  background: url(g/f.png) -241px -87px
}

.f-i-file-xls {
  background: url(g/f.png) -385px -87px
}

.f-i-file-fla {
  background: url(g/f.png) -529px -87px
}

.f-i-file-fon {
  background: url(g/f.png) -97px -190px
}

.f-i-file-zip {
  background: url(g/f.png) -241px -190px
}

.f-i-file-eps {
  background: url(g/f.png) -385px -190px
}

.f-i-file-txt {
  background: url(g/f.png) -529px -190px
}

.f-i-file-aud {
  background: url(g/f.png) -673px -190px
}

.f-i-file-pdf {
  background: url(g/f.png) -241px -293px
}

.f-i-file-ai {
  background: url(g/f.png) -385px -293px
}

.f-i-file-psd {
  background: url(g/f.png) -529px -293px
}

.f-i-file-img {
  background: url(g/f.png) -673px -293px
}

.f-i-file-css {
  background: url(g/f.png) -97px -396px
}

.f-i-file-doc {
  background: url(g/f.png) -241px -396px
}

.f-i-file-iso {
  background: url(g/f.png) -385px -396px
}

.f-i-file-js {
  background: url(g/f.png) -529px -396px
}

.f-i-file-file {
  background: url(g/f.png) -673px -396px
}

.f-i-file-htm {
  background: url(g/f.png) -97px -396px
}

@keyframes f-spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
